<!DOCTYPE html>
<html lang="zh-cN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScipt异步编程</title>
    <script src="../js/js09_aysnc_promise.js" async></script>
    <link rel="stylesheet" href="../css/common.css">
</head>
<body>
    <h1>Promise——JavaScipt现代异步编程基础</h1>
    <p class="msg"></p>
    <script>
        document.addEventListener("DOMContentLoaded",function(){
            let msg = document.querySelector(".msg");
            
            //使用Promise对象
            myPromise.then((res)=>{
                msg.innerHTML += `${res.msg}:${res.value}<br>`;
            },
            (err)=>{
                msg.innerHTML += `${err.msg}:${err.value}<br>`;
                msg.classList.add("danger");
            });

            //Promise链式访问:then()返回Promise对象
            myPromise.then((res)=>{
                msg.innerHTML += `${res.msg}:${res.value}<br>`;
                return res;
            }).then(res =>{
                console.log(`Promise链式调用：${res.msg}`);
                return 10;
            }).then(data =>{
                console.log(`Promise链式调用：${data}`);
            }).catch(err =>{
                msg.innerHTML += `${err.msg}:${err.value}<br>`;
                msg.classList.add("danger");
            });
        });
    </script>
</body>
</html>